<template>
  <div class="container" ref="mainCon">
    <topTitle
      :titleText="titleText"
      :dateStr="dateStr"
      :titleExplain="titleExplain"
    ></topTitle>
    <div class="mainCon">
      <el-row class="toolbar searchInputWidth" style="padding-bottom: 0">
        <el-form :inline="true" :model="filterField" ref="searchConditions">
          <el-form-item label="项目名称" class="row-padding-bottom">
            <el-input
              placeholder="请输入项目名称"
              clearable
              v-model="filterField.projectName"
              @blur="filterField.projectName = changeValue($event)"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              icon="icon iconfont iconchazhao1"
              @click="searchList"
              class="commonBtn"
            ></el-button>
          </el-form-item>
          <el-form-item class="fr">
            <el-button
              class="commonBut saveBtn funComBut"
              icon="icon iconfont icondaochu"
              @click="exportExcel"
              ><span class="opetareText">导出报表</span></el-button
            >
          </el-form-item>
        </el-form>
      </el-row>
      <div class="spacing"></div>
      <div
        ref="tableBox"
        :class="hiddleToolBar ? 'tableBoxCur tableBox' : 'tableBoxCur'"
      >
        <el-table
          ref="tableBox1"
          :max-height="tableHeight"
          :data="tableList"
          :header-cell-style="{ background: '#eef1f6', color: '#606266' }"
          highlight-current-row
          v-loading="loading"
          stripe
          style="border: 1px solid #dfe6ec"
        >
          <el-table-column
            prop="projectCode"
            label="招标项目编号"
            align="center"
          ></el-table-column>
          <!-- <el-table-column prop="ownerName" label="项目业主名称"  align="center">
        </el-table-column>  -->
          <el-table-column prop="ownerName" label="项目业主名称" width="230">
            <template slot-scope="scope">
              <copyText
                :tableIndex="scope.$index"
                :copyTextName="scope.row.ownerName"
                :columnName="'ownerName'"
              ></copyText>
            </template>
          </el-table-column>
          <el-table-column
            prop="projectName"
            label="招标项目名称"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="tendercontent"
            label="招标项目信息"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="tenderername"
            label="招标人名称"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="transactionCode"
            label="交易方式"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="industryCategory"
            label="行业类别"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="projectDistrict"
            label="项目所属行政区划"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="projecttype"
            label="招标项目类型"
            align="center"
          >
          </el-table-column>
          <el-table-column prop="batchno" label="批次号" align="center">
          </el-table-column>
          <el-table-column
            prop="createtime"
            label="受理登记时间"
            align="center"
          >
          </el-table-column>
          <!-- 表格数据为空时，页面显示 -->
          <div slot="empty" v-show="isShow">
            <emptyTable emptyText="暂无相关信息"></emptyTable>
          </div>
        </el-table>
        <Pagination
          ref="pagination"
          @getList="getTableList"
          :filterField="filterField"
          :requestUrl="requestUrl"
        ></Pagination>
      </div>
    </div>
  </div>
</template>

<script>
import scrollTable from '@/mixin/scrollTable.js'
import common from '../../kits/common'
export default {
  name: 'qtzbxmxx',
  mixins: [scrollTable],
  data() {
    return {
      titleText: '招标局项目',
      dateStr: '报表每日23点更新',
      titleExplain: '所有招标局定期推送的项目',
      //表格数据
      tableList: [],
      isShow: false, //列表加载
      loading: true,
      tableList: [],
      requestUrl: 'api-out/qtzbxmxx/list',
      //搜索条件
      filterField: {
        projectName: '',
      },
    }
  },

  created() {
    this.$nextTick(function () {
      this.$refs.pagination.getTableListData()
    })
  },
  methods: {
    // 初始化获取表格数据
    getTableList(data) {
      console.log(data)
      this.tableList = data
      this.loading = false
      if (this.tableList.length < 1) {
        this.isShow = true
      }
    },
    // 搜索
    searchList() {
      this.$refs.pagination.getTableListData()
    },
    // 导出
    exportExcel() {
      window.location.href =
        common.commonApi +
        'api-out/qtzbxmxx/exportproject?projectName=' +
        this.filterField.projectName
    },
  },
}
</script>

<style scoped>
/* 页面top 顶部栏样式 */
.container /deep/ .topTitle .btn {
  top: 11px;
}
.container /deep/ .topTitle .dateShow {
  top: 20px;
}
.mainCon {
  top: 212px;
}
</style>
